<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<script type="text/javascript" src="./dist/jquery-3.2.1.js"></script>
	<script type="text/javascript" src="./dist/js/bootstrap.js"></script>
	<link rel="stylesheet" type="text/css" href="./dist/css/bootstrap.css">
	<link rel="stylesheet" type="text/css" href="./font/iconfont.css">
	<title></title>
</head>
<style type="text/css">
	
</style>
<body>
	<!-- 个人注册页面 -->
<form>
	<div class="form-group has-success has-feedback">
		<label>用户名：</label>
		<input type="text" class='form-control input-lg' placeholder='user1'>
		<span class='glyphicon glyphicon-ok form-control-feedback'></span>
	</div>
	<div class="form-group">
		<label>密码：</label>
		<input type="text" class='form-control' placeholder='123456'>
		<p class='help-block'>密码需要包括字符数字标点符号</p>
	</div>
	<div class="form-group">
		<label>留言板：</label>
		<textarea class='form-control'></textarea>
	</div>
	<div class="form-group">
		<select class='form-control'>
			<option>城市</option>
			<option>福州</option>
			<option>泉州</option>
		</select>
	</div>
	<div class="from-group">
		<label>单选框</label>
		<div class="checkbox">
			<label><input type="radio" value="" name='a'>篮球</label>
		</div>
		<div class="checkbox">
			<label><input type="radio" value="" name='a'>篮球</label>
		</div>
	</div>
	<div class="from-group">
		<label>多选框</label>
		<div class="checkbox">
			<label><input type="checkbox" value="">篮球</label>
		</div>
		<div class="checkbox">
			<label><input type="checkbox" value="">篮球</label>
		</div>
	</div>
	<div class="form-group">
		<label>文件上传框</label>
		<input type="file" name="">
	</div>
	<div class="form-group">
		<div class="input-group">
			<div class="input-group-addon">$</div>
			<input type='text' class="form-control"></input>
			<div class="input-group-addon">.00</div>
		</div>
	</div>
	<div class="form-group">
		<input type="submit" value='ok' class='btn btn-primary' >
		<input type="reset" class='btn btn-danger' value='reset'>
	</div>
</form>
<!-- 水平排列列表 -->
<form class='form-horizontal has-success'>

	<div class="form-group">
			<label class="col-sm-2 control-label">username</label>
			<div class="col-sm-10">
				<p class='form-control-static'>xiaojin</p>		
				<input type="text" class='form-control' name="" disabled>
			</div>		
	</div>	
</form>
<!-- 默认字体 -->
<form class='form-horizontal'>
<fieldset disabled>
	<legend>linux</legend>
	<div class="form-group">
			<label class="col-sm-2 control-label">username</label>
			<div class="col-sm-10">
				<p class='form-control-static'>xiaojin</p>	
				<input type="text" class='form-control' name="" readonly>
			</div>		
	</div>	
</fieldset>	
</form>
	<!-- 输入框的尺寸 -->
	<form class='from-horizontal'>
		<div class="input-group input-group-lg">
			<div class="input-group-addon">$</div>
			<input type="text" class='form-control' name="">
			<div class="input-group-addon">.00</div>
		</div>
	</form>	
	<!-- 输入框组嵌入多选 -->
	<form class='form-horizontal'>
		<div class="input-group">
			<div class="input-group-addon">
				<input type="checkbox" name="">
			</div>
			<input class="form-control"></input>
			<div class="input-group-addon">.00</div>
		</div>
	</form>
	<!-- 输入框嵌入按钮组 -->
	<form class="form-horizontal">
		<div class="input-group">
			<div class="input-group-btn">
				<button class='btn btn-danger'>go</button>
			</div>
			<input type="text" class='form-control' name="">
		</div>
	</form>
<!-- 输入框嵌入下拉菜单 -->
	<form>
		<div class="input-group">
			<div class="input-group-btn">
				<button class='btn btn-danger drag-toggle' data-toggle='dropdown'>go <span class='caret'></span></button>
				<ul class='dropdown-menu'>
					<li><a href="">baidu</a></li>
					<li><a href="">baidu</a></li>
					<li><a href="">baidu</a></li>
				</ul>
			</div>
			<input type='text' class="form-control"></input>
		</div>
	</form>


</body>
<script type="text/javascript">
	
</script>
</html>